<template>
    <img v-show="showImage" :src="src" :style="{ width }" @load="showImage = true" @error="showImage = false">
    <img v-show="!showImage" src="../assets/img/default_image.svg" :style="{ width }">
</template>

<script>
    /** 
     * 图片组件
     */
    export default {
        data() {
            return {
                showImage: false,    // 是否显示图片
            }
        },
        props: {
            // 图片连接
            src: {
                type: String,
                default: ''
            },
            // 图片宽度
            width: {
                type: String,
                default: '50px'
            }
        }
    }
</script>

<style lang="less" scoped>
    img {
        width: 50px;
    }
</style>